import 'package:flutter/material.dart';

void main() => runApp(MyApp());

/*  
ConstrainedBox和SizedBox都是通过RenderConstrainedBox来渲染的。
SizedBox只是ConstrainedBox的一个定制

BoxConstraints还定义了一些便捷的构造函数，用于快速生成特定限制规则的BoxConstraints，
如BoxConstraints.tight(Size size)，
它可以生成给定大小的限制；const BoxConstraints.expand()可以生成一个尽可能大的用以填充另一个容器的BoxConstraints。
 
SizedBox用于给子widget指定固定的宽高，
实际上SizedBox只是ConstrainedBox的一个定制

多重限制
如果某一个widget有多个父ConstrainedBox限制，那么最终会是哪个生效？
通过示例，我们发现有多重限制时，对于minWidth和minHeight来说，
是取父子中相应数值较大的。实际上，只有这样才能保证父限制与子限制不冲突。

UnconstrainedBox不会对子Widget产生任何限制，它允许其子Widget按照其本身大小绘制
UnconstrainedBox对父限制的“去除”并非是真正的去除，
可以认为此时的父ConstrainedBox是作用于子UnconstrainedBox上，而redBox只受子ConstrainedBox限制
*/
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Flutter Demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: new Scaffold(
            appBar: new AppBar(
              title: new Text('SizeBox和ConstrainedBox'),
              actions: <Widget>[
                UnconstrainedBox(
                  child: new Padding(
                    padding: EdgeInsets.only(right: 20),
                    child: SizedBox(
                    width: 20,
                    height: 20,
                    child: CircularProgressIndicator(
                      strokeWidth: 3,
                      valueColor: AlwaysStoppedAnimation(Colors.white70),
                    ),
                  ),
                  ),
                )
              ],
            ),
            body: new Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                new ConstrainedBox(
                    constraints: new BoxConstraints(
                        minHeight: 50, minWidth: double.infinity),
                    // constraints: BoxConstraints.tight(Size(100, 100)),
                    // constraints: const BoxConstraints.expand(),
                    child: new Container(
                      color: Colors.red,
                      height: 5,
                    )),
                new SizedBox(
                  width: double.infinity,
                  height: 100,
                  child: new Container(
                    color: Colors.orange,
                  ),
                ),
                new ConstrainedBox(
                  constraints: BoxConstraints(minWidth: 60, minHeight: 60),
                  child: new ConstrainedBox(
                    constraints: BoxConstraints(
                        minWidth: 10, minHeight: 100, maxWidth: 100),
                    child: new Container(
                      color: Colors.red,
                    ),
                  ),
                ),
                new ConstrainedBox(
                  constraints:
                      BoxConstraints(minHeight: 100, minWidth: double.infinity),
                  child: new UnconstrainedBox(
                    // 去除父级限制
                    alignment: Alignment.topLeft, // 对齐方式，默认居中
                    child: new ConstrainedBox(
                      constraints: BoxConstraints(minWidth: 100, minHeight: 50),
                      child: new Container(
                        color: Colors.blue,
                      ),
                    ),
                  ),
                )
              ],
            )));
  }
}
